<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>classes.组件</title>
    <script src="../vue3.js"></script>
</head>
<body>
    <div id="app">
        <h1>ACCP</h1>
        <input v-model="title"/>
        <child-comp msg="第一课" @ok="doOK" @cancel="doCancel">
            <p>java</p>
            <p>html</p>
        </child-comp>
        <child-comp msg="第二课" @ok="doOK" @cancel="doCancel">
            <ul>
                <li>c#</li>
                <li>js</li>
            </ul>
        </child-comp>
    </div>
    <script type="module">
        import ChildComp from './ChildComp.js'
        let {createApp} = Vue
        createApp({
            data(){
              return {
                  title:''
              }
            },
            components: {
                ChildComp
            },
            methods:{
                doOK(){
                    alert('去做吧')
                },
                doCancel(){
                    alert('取消吧')
                }
            }
        }).mount('#app')
    </script>
</body>
</html>